.TeacherVideoPage {
    display: grid;
    padding: 90px 10%;
    grid-template-columns: 70% 30%;
    grid-auto-rows: 80px 600px;
    column-gap: 20px;

    header {
        grid-row: 1;
        grid-column: 1;
        display: flex;
        align-items: center;

        button {
            margin-right: auto;
            font-size: 17px;
            transition: all .3s;
            
            &:hover {
                color: #5cb3cc;
                cursor: pointer;
            }
        }

        div {
            margin-right: 45%;
            display: flex;
            flex-direction: column;
            text-align: center;

            h1 {
                font-size: 20px;
                font-weight: 500;
            }

            span {
                font-size: 14px;
            }
        }

    }

    main {
        grid-row: 2;
        grid-column: 1;
        // background-color: aquamarine;

        video {
            width: 100%;
        }
    }

    ul {
        grid-row: 1/3;
        overflow: auto;
        box-shadow: 0 0 5px 2px rgba($color: #bbbbbb, $alpha: .5);
        border-radius: 5px;

        &::-webkit-scrollbar {
            width: 6px;
        }

        &::-webkit-scrollbar-track {
            border-radius: 3px;
        }

        &::-webkit-scrollbar-thumb {
            border-radius: 3px;
            background-color: #bbbbbb;
        }
    }

}